<template>
    <div class="pageContainer">
        <div class="searchWarp">
            <el-form inline>
                <template v-for="condition in listCondition">
                    <CText :title="condition.name" v-model="condition.value"></CText>
                </template>
            </el-form>
            <div class="schLine">
                <CBtn @click="search(1)">查询</CBtn>
            </div>
        </div>
        <div class="treeTable">
            <CCateTree :treeData="treeData" @nodeClick="nodeClick"></CCateTree>
            <div style="flex:1;">
                <div class="btnWarp">
                    <CBtn @click="showEdit">新增</CBtn>
                    <CBtn @click="showCopy">拷贝</CBtn>
                    <CBtn @click="doBatchDel()">批量删除</CBtn>
                </div>
                <CPageTable :data="tableData" :curPage="paging.curPage" :total="paging.total" 
                    @changeSelect="changeSelect"
                    @changeSize="changeSize" @changePage="search">
                    <template slot-scope="scope">
                        <CBtn type="text" @click="showEdit(scope.row)">修改</CBtn>
                        <CBtn type="text" @click="showCopyRow(scope.row)">复制</CBtn>
                        <CBtn type="text" @click="doDel(scope.row)">删除</CBtn>
                    </template>
                </CPageTable>
            </div>
        </div>

        <CDailog title="新增/编辑" :isShow="isShowEdit" @close="isShowEdit = false" @enter="doSave">
            <el-form :inline="true">
                <CText form v-model="mm.code" title="编码" field="code"></CText>
                <CText form v-model="mm.name" title="名称" field="name"></CText>
                <CSelect form v-model="mm.permType" title="权限类型" field="permType" opType="permType"></CSelect>
                <CSelect form v-if="mm.permType == 'D'" v-model="mm.fkParentId" title="父节点" field="fkParentId" opType="opMenu"></CSelect>
                <CText form v-if="mm.permType == 'D'" v-model="mm.url" title="URL" field="url"></CText>
                <CText form v-if="mm.permType == 'C'" v-model="mm.icon" title="图标" field="icon"></CText>
                <CSelect form v-if="mm.permType == 'D'" v-model="mm.comType" title="组件类型" field="comType" opType="comType"></CSelect>
                <CText form v-if="mm.permType == 'D'" v-model="mm.fkPageId" title="页面id" field="fkPageId"></CText>
                <CText form v-if="mm.permType == 'D'" v-model="mm.component" title="组件路径" field="component"></CText>
                <CText form v-model="mm.sortNum" title="排序" field="sortNum"></CText>
                <CText form v-model="mm.level" title="层级" field="level"></CText>
            </el-form>
        </CDailog>

        <CDailog title="拷贝菜单" :isShow="isShowCopy" @close="isShowCopy = false" @enter="doCopy">
            <template>
                <div style="width: 50%;">
                    <el-tree ref="menuTree" :data="treeMenu" show-checkbox node-key="id" :default-expanded-keys="[]" 
                        :props="treeProps">
                    </el-tree>
                </div>
                <div style="width: 50%">
                    <CSelect v-model="systemId" title="拷贝到" field="copyMenu" opType="opSystem"></CSelect>
                </div>
            </template>
        </CDailog>
    </div>
</template>

<script>
import pagingMixin from '@/mixin/pagingMixin'
export default {
    mixins: [pagingMixin],
    data() {
        return {
            systemId: '',
            isShowCopy: false,
            model: "ums",
            table: "UmsPermission",
            treeData: [],
            treeMenu: [],
            treeProps: {
                children: 'listChild',
                label: 'label'
            },
        }
    },
    created() {
        this.templateId = "a243b3ba-48a7-4e51-b859-698f8f7ab5d1";
        
        //取得查询条件
        this.$sys.getPageConditions({id: this.templateId}).then(res => {
            this.listCondition = res.data;
        })
        //查询表格数据
        this.search(1);

        this.searchTree();
    },
    methods: {
        searchTree() {
            this.$sys.getTreeByCode({code: "tree_system"}).then(res => {
                this.treeData = res.data;
            })
        },
        nodeClick(node) {
            let conditions = [...this.listCondition];
            this.$u.addWhere(conditions, "fk_system_id", node.id);
            this.search(1, conditions);
        },
        showCopy() {
            this.$ums.getAllMenu().then(res => {
                this.treeMenu = res.data.tree;
                this.isShowCopy = true;
            })
        },
        doCopy() {
            let checkedNodes = this.$refs.menuTree.getCheckedNodes(false, true);

            let ids = checkedNodes.filter(item => item.id && item.systemId != item.id);
            this.$ums.saveCopyPermission({
                listPermissionIds: ids.map(item => item.id),
                systemId: this.systemId
            }).then(res => {
                if (200 == res.code) {
                    this.$message.success("拷贝成功")
                }
            })
        }
    }
}
</script>

<style lang="scss" scoped></style>